<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<link rel="stylesheet" href="css/bootstrap.min.css" />
		<link rel="stylesheet" href="css/main.css" />
		<!--<script type="text/javascript" src="js/fire.js" ></script>-->
	</head>
	<body>
		<!--登陆模态框-->
		<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" >
		  <div class="modal-dialog" role="document">
		    <div class="modal-content">
		    <div class="modal-header">
		    	<ul class="nav nav-justified" role="tablist">
		    		<li role="presentation" class="active" ><a href="#login0" aria-controls="login0" role="tab" data-toggle="tab">登陆</a></li>
		    		<li role="presentation"><a href="#register" aria-controls="register" role="tab" data-toggle="tab">注册</a></li>
				</ul>
		    </div>
		    <div class="modal-body">
			  <div class="tab-content">
			    <div role="tabpanel" class="tab-pane active" id="login0">			    	
			    	<form class="form-horizontal">
			  			<div class="form-group">
			    			<label for="inputNumber0" class="col-sm-2 col-md-offset-2 col-sm-offset-2 control-label">学号</label>
			    			<div class="col-sm-5">
			      			<input type="text" class="form-control" id="inputNumber0" placeholder="User">
			    			</div>
			  			</div>
			  			<div class="form-group">
			    			<label for="inputPassword3" class="col-sm-2 col-md-offset-2 col-sm-offset-2 control-label">密码</label>
			    			<div class="col-sm-5">
			      			<input type="password" class="form-control" id="inputPassword3" placeholder="Password">
			    			</div>
			  			</div>
			  			
			  			<div class="form-group">
			    			<div class=" col-sm-offset-4  col-sm-10">
			      				<div class="checkbox">
			        			<label>
			          			<input type="checkbox">记住密码
			        			</label>
			      				</div>
			    			</div>
			  			</div>
			  			<div class="form-group  mymodal-hengxian">
			    			<div class="col-sm-4 col-md-offset-4 col-sm-offset-4">
			      				<a href="#">忘记密码？</a>
			    			</div>
			  			</div>
			  			<div class="form-group">
			  				<div class="col-sm-offset-4 col-sm-10">
			  		<button type="button" class="btn btn-default " data-dismiss="modal" style="margin: 0px;">关闭</button>
			        <button type="submit" class="btn btn-primary ">登陆</button>
			        </div>
			        </div>
			  			</form>

			    </div>
			    <div role="tabpanel" class="tab-pane" id="register">
			    	<form class="form-horizontal">
			  			<div class="form-group">
			    			<label for="inputNumber0" class="col-sm-2 col-md-offset-2 col-sm-offset-2 control-label">学号</label>
			    			<div class="col-sm-5">
			      			<input type="text" class="form-control" id="inputNumber0" placeholder="User">
			    			</div>
			  			</div>
			  			<div class="form-group">
			    			<label for="inputPassword3" class="col-sm-2 col-md-offset-2 col-sm-offset-2  control-label">密码</label>
			    			<div class="col-sm-5">
			      			<input type="password" class="form-control" id="inputPassword3" placeholder="Password">
			    			</div>
			  			</div>
			  			<div class="form-group">
			    			<label for="inputPassword4" class="col-sm-2 col-md-offset-2 col-sm-offset-2 control-label">密码</label>
			    			<div class="col-sm-5">
			      			<input type="password" class="form-control" id="inputPassword4" placeholder="Password">
			    			</div>
			  			</div>
			  			<div class="form-group mymodal-hengxian">
			    			<div class="col-sm-offset-4 col-sm-10">
			      				<div class="checkbox">
			        			<label>
			          			<input type="checkbox">记住密码
			        			</label>
			      				</div>
			    			</div>
			  			</div>
			  			<div class="form-group">
			  				<div class="col-sm-offset-4 col-sm-10">
			  		<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
			        <button type="submit" class="btn btn-primary">注册</button>
			        </div>
			        </div>
			  			</form>
					     </div>
					</div>
				</div>
		    </div>
		    </div>
		  </div>
		  <!--模态框结束-->
		  <!--导航栏-->
		  
		  <div class="container">
		  	<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
                <!-- Indicators -->
                <ol class="carousel-indicators">
                    <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
                    <li data-target="#carousel-example-generic" data-slide-to="1"></li>
                    <li data-target="#carousel-example-generic" data-slide-to="2"></li>
                </ol>

                <!-- Wrapper for slides -->
                <div class="carousel-inner">
                    <div class="item active" id="t1">
                        <img src="img/0.jpg" alt="...">
                        <div class="carousel-caption">
                            <h3>标题1</h3>
                            <p>para1</p>
                        </div>
                    </div>
                    <div class="item" id="t2">
                        <img src="img/0.jpg" alt="...">
                        <div class="carousel-caption">
                            <h3>标题2</h3>
                            <p>para2</p>
                        </div>
                    </div>
                    <div class="item" id="t3">
                        <img src="img/0.jpg" alt="...">
                        <div class="carousel-caption">
                            <h3>标题3</h3>
                            <p>para3</p>
                        </div>
                    </div>
                </div>

                <!-- Controls -->
                <a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
                    <span class="glyphicon glyphicon-chevron-left"></span>
                </a>
                <a class="right carousel-control" href="#carousel-example-generic" data-slide="next">
                    <span class="glyphicon glyphicon-chevron-right"></span>
                </a>
            </div>
		  </div>
<div id="mymove">
<div class="container" id="home">
<nav class="navbar navbar-default " >
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header" style="position: relative;">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#">Brand</a>
      
    </div>
    <div class="collapse navbar-collapse mynavbar" id="bs-example-navbar-collapse-1" >
      <ul class="nav navbar-nav navbar-right">
        <li><a href="#">主页</a></li>
        <li><a  onclick="page1animation()">失物招领</a></li>
        <li><a href="#test2" >发布寻物</a></li>
        <li><a data-toggle="modal" data-target="#myModal"  style="cursor:pointer">登陆</a></li><!--模态框按钮--> 
      </ul>
    </div>
</nav>
</div>
<!--导航栏-->
<div class="container">
	<div class="text-center"  id="center">
		<h1>Start Your Finding</h1>
		<div class="col-md-6 col-md-offset-3" style="text-align: center;">
		<form>
		<div class="input-group">
      			<input type="text" class="form-control mysearch" placeholder="请输入查找内容">
      			<span class="input-group-btn">
       			 <button class="btn btn-default mysearch" type="button">搜索</button>
      			</span>
		</div>
		</form>
	</div>
</div>
</div>
</br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br>
</br></br></br></br></br></br></br></br>
</div>
<!--菜单按钮-->
<div id="myleftmenu" style="position: absolute">
	<a class="btn btn-success" id="mymenu">菜单</a>
	<span class="leftbar" id="leftbar">
	<ul class="nav myleftnav  " >
		<li style=" border-radius: 10px 10px 0 0;><a style="cursor:pointer">关闭</a></li>
		<li><a href="#home" style="cursor:pointer">主页</a></li>
		<li><a href="#test1" style="cursor:pointer">失物招领</a></li>
		<li><a href="#test2" style="cursor:pointer">最新消息</a></li>
		<li style=" border-radius: 0 0 10px 10px ;">登陆</li>
	</ul>
	</span>
</div>
<!--菜单按钮结束-->
<div class="container">
<div id="test1" style="padding-top:50px ;margin-top:-50px ;">
	<!--采用div的话 绑定a或者li的点击事件 阻止a的默认行为 然后ajax html字符串 success的时候设置div的innerHTML就可以了-->
		<div class="row">
	  		<div class="col-md-4 col-sm-4" id="mylpage1" >
	  	<ul style="list-style-type: none; padding: 0px;">
			<li><a class="btn btn-default btn-lg btn-block chosebutton" href="#contblock1" role="button">校园卡</a></li>
			<li><a class="btn btn-default btn-lg btn-block chosebutton" href="#contblock100" role="button">身份证</a></li>
			<li><a class="btn btn-default btn-lg btn-block chosebutton" href="#" role="button">钱包</a></li>
			<li><a class="btn btn-default btn-lg btn-block chosebutton" href="#" role="button">其他</a></li>
		</ul>
			</div>
			<div class="col-md-8 col-sm-8 myrightpage" id="myrpage1" >
				<div class="contblock" id="contblock100">
										<div class="media" style="padding:9px ;">
					  <div class="media-left">
					    <a href="#">
					      <img class="media-object" src="img/qianbao.jpg" alt="..." style="border-radius: 10px;">
					    </a>
					  </div>
					  <div class="media-body">
					    <h4 class="media-heading">捡到钱包一个</h4>
					     <h5>我在马路边捡到一分钱---身份证</h5>
					     <h6>2017-04-11 16:56</h6>
					  </div>
					</div>
				</div>
								<div class="contblock">
										<div class="media" style="padding:9px ;">
					  <div class="media-left">
					    <a href="#">
					      <img class="media-object" src="img/qianbao.jpg" alt="..." style="border-radius: 10px;">
					    </a>
					  </div>
					  <div class="media-body">
					    <h4 class="media-heading">捡到钱包一个</h4>
					     <h5>我在马路边捡到一分钱</h5>
					     <h6>2017-04-11 16:56</h6>
					  </div>
					</div>
				</div>
								<div class="contblock">
										<div class="media" style="padding:9px ;">
					  <div class="media-left">
					    <a href="#">
					      <img class="media-object" src="img/qianbao.jpg" alt="..." style="border-radius: 10px;">
					    </a>
					  </div>
					  <div class="media-body">
					    <h4 class="media-heading">捡到钱包一个</h4>
					     <h5>我在马路边捡到一分钱</h5>
					     <h6>2017-04-11 16:56</h6>
					  </div>
					</div>
				</div>
								<div class="contblock">
										<div class="media" style="padding:9px ;">
					  <div class="media-left">
					    <a href="#">
					      <img class="media-object" src="img/qianbao.jpg" alt="..." style="border-radius: 10px;">
					    </a>
					  </div>
					  <div class="media-body">
					    <h4 class="media-heading">捡到钱包一个</h4>
					     <h5>我在马路边捡到一分钱</h5>
					     <h6>2017-04-11 16:56</h6>
					  </div>
					</div>
				</div>
								<div class="contblock">
										<div class="media" style="padding:9px ;">
					  <div class="media-left">
					    <a href="#">
					      <img class="media-object" src="img/qianbao.jpg" alt="..." style="border-radius: 10px;">
					    </a>
					  </div>
					  <div class="media-body">
					    <h4 class="media-heading">捡到钱包一个</h4>
					     <h5>我在马路边捡到一分钱</h5>
					     <h6>2017-04-11 16:56</h6>
					  </div>
					</div>
				</div>
								<div class="contblock">
										<div class="media" style="padding:9px ;">
					  <div class="media-left">
					    <a href="#">
					      <img class="media-object" src="img/qianbao.jpg" alt="..." style="border-radius: 10px;">
					    </a>
					  </div>
					  <div class="media-body">
					    <h4 class="media-heading">捡到钱包一个</h4>
					     <h5>我在马路边捡到一分钱</h5>
					     <h6>2017-04-11 16:56</h6>
					  </div>
					</div>
				</div>
								<div class="contblock">
										<div class="media" style="padding:9px ;">
					  <div class="media-left">
					    <a href="#">
					      <img class="media-object" src="img/qianbao.jpg" alt="..." style="border-radius: 10px;">
					    </a>
					  </div>
					  <div class="media-body">
					    <h4 class="media-heading">捡到钱包一个</h4>
					     <h5>我在马路边捡到一分钱</h5>
					     <h6>2017-04-11 16:56</h6>
					  </div>
					</div>
				</div>
								
								<div class="contblock">
										<div class="media" style="padding:9px ;">
					  <div class="media-left">
					    <a href="#">
					      <img class="media-object" src="img/qianbao.jpg" alt="..." style="border-radius: 10px;">
					    </a>
					  </div>
					  <div class="media-body">
					    <h4 class="media-heading">捡到钱包一个</h4>
					     <h5>我在马路边捡到一分钱</h5>
					     <h6>2017-04-11 16:56</h6>
					  </div>
					</div>
				</div>
			</div>
			</div>
		</div>
		
</div>
</div><!--container-->

</br>
</br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br>
</br></br></br></br></br></br></br></br></br></br>
<div class="container">
	<marquee scrollamount="9" behavior="scroll">滚动文字</marquee>
	<marquee>滚动文字</marquee>
	<marquee>滚动文字</marquee>
	<marquee>滚动文字</marquee>
</div>


<div class="container" id="test2">
	<div class="row">
		<div class="col-lg-6 col-md-6">
			<a class=" btn-default btn-lg btn-block newsleft"><span class="glyphicon glyphicon-list"></span>网站新闻</a>
			<div class="newscont" style="text-align: center;">
				<h3>[最新消息]岭师失物招领平台正式上线啦！！！</h3>
				<h3>[最新消息]岭师失物招领平台正式上线啦！！！</h3>
				<h3>[最新消息]岭师失物招领平台正式上线啦！！！</h3>
			</div>
		</div>
		<div class="col-lg-6 col-md-6">
			<a class=" btn-default btn-lg btn-block newsleft"><span class="glyphicon glyphicon-list"></span>最新评论</a>
			<div class="newscont" style="text-align: center;">
				<h3>[最新消息]岭师失物招领平台正式上线啦！！！</h3>
				<h3>[最新消息]岭师失物招领平台正式上线啦！！！</h3>
				<h3>[最新消息]岭师失物招领平台正式上线啦！！！</h3>
			</div>
		</div>
	</div>
</div>

<footer style="text-align: center;margin-top: 50px;">
	<a>校园失物招领平台@2017</a>
		
</footer>
		<script type="text/javascript" src="js/jquery-3.1.1.min.js" ></script>
		<script type="text/javascript" src="js/bootstrap.min.js" ></script>
		<script type="text/javascript" src="js/main.js" ></script>
		
	</body>
</html>
